14 - 冒泡，默认行为，自动触发，自定义事件

事件冒泡

什么是事件冒泡？
触发子元素的时候，会触发父元素绑定的事件
如何阻止事件冒泡？
- 在子元素绑定的事件中添加return false;
- 在子元素绑定的事件中添加event.stopPropagation();

默认行为

什么是默认行为？
a标签点击事件默认会触发跳转到href中的链接地址去
如何组织默认行为？
- 在子元素绑定的事件中添加return false;
- 在子元素绑定的事件中添加event.preventDefault();

自动触发

trigger: 如果利用trigger自动触发事件,会触发事件冒泡，会触发默认行为
triggerHandler: 如果利用triggerHandler自动触发事件, 不会触发事件冒泡，不会触发默认行为

示例代码：

<script>
    $(function () {
        $(".son").click(function (event) {
            alert("son");
        });

        $(".father").click(function () {
            alert("father");
        });
        $(".father").trigger("click");
        $(".father").triggerHandler("click");


        $(".son").trigger("click");
        $(".son").triggerHandler("click");

        $("input[type='submit']").click(function () {
            alert("submit");
        });

        $("input[type='submit']").trigger("click");
        $("input[type='submit']").triggerHandler("click");


        $("span").click(function () {
            alert("a");
        });
        // $("a").triggerHandler("click");
        $("span").trigger("click");
    });
</script>

自定义事件

事件必须是通过on绑定的
事件必须通过trigger来触发

示例代码：

$(".son").on("myClick", function () {
    alert("son");
});
$(".son").triggerHandler("myClick");